import React from 'react'
import { BaseListPage, IBaseListPageProps, IBaseListPageState, columnRenders, UdModal } from '@/lib'
import { Radio, Select } from 'antd'
import apis from '@/apis/CustomerManage'
import { settledReviewOpenModal } from '@/common/SettledReview'
import ReviewLogContent from '../component/ReviewLogContent'
import udMainStore from '@/store/UdMain'

const Option = Select.Option
const DetailBtnAuth = 'user_customer_settled_detail'
const ReviewBtnAuth = 'user_customer_settled_complete'
const LogBtnAuth = 'user_customer_settled_history'

export default class List extends BaseListPage<ISettledReviewListProps,ISettledReviewListState> {
  private agentTypeEnum = {
    0: '经销商',
    1: '分销商',
  }
  // 流程实例状态
  private statusEnum = {
    0: '审批中',
    1: '审核通过',
    2: '审批不通过',
  }
  // private statusOpitons = Object.keys(this.statusEnum).map(key=>({value:key,title:this.statusEnum[key]}))
  
  public brandList = udMainStore.brandList
  public initialBrandValue = udMainStore.initialBrandValue
  
  constructor(props) {
    super(props)
    this.state = {
      title: '入驻资质审核',
      queryApi: apis.SettledList,
      method: 'GET',
      rowKey: 'id',
      conditions: [
        { id: 'brandCode', label: '品牌公司', initialValue: this.initialBrandValue, render: (
          <Select allowClear={false}>
            { this.brandList.map(({value, title}) => <Option key={value} value={value}>{title}</Option> )}
          </Select>
        ) },
        {id:'companyName',label:'客户名称'},
        {id:'approvalStatus',label:'流程状态',render:()=>{
        return <Select>{Object.keys(this.statusEnum).map(key=><Option key={key} value={key}>{this.statusEnum[key]}</Option>)}</Select>
        }},
      ],
      columns: [
        ['序号','id',(text,record,index)=>index+1],
        ['商户类型','agentType',columnRenders.enum(this.agentTypeEnum)],
        ['注册手机号','registerPhone'],
        ['客户名称','companyName'],
        ['所属管理区域','belongAreaName'],
        ['流程状态','approvalStatus',columnRenders.enum(this.statusEnum)],
        {
          title: '操作',
          width: 150,
          dataIndex: 'operate',
          render: columnRenders.operate([
            {
              title: '详情', auth: DetailBtnAuth, action: (text: any, row: any) => this.toDetail(row)
            },
            {
              title: '审批', auth: ReviewBtnAuth, show: (text, row) => row['taskStatus'] == 0, action: (text: any, row: any) => this.reviewHandle(row)
            },
            {
              title: '审批日志', auth: LogBtnAuth, action: (text: any, row: any) => this.viewLogs(row)
            },
          ])
        }
      ],
    }
  }

  public toDetail = (row) => {
    const { id } = row
    this.props.history.push('/customer/settled/'+id)
  }

  public reviewHandle = (row) => {
    const { taskDefId: taskId } = row
    const successSubmit = () => {
      this.query()
    }
    settledReviewOpenModal({ data: { ...row, taskId }, successSubmit })
  }

  public viewLogs = (row) => {
    const { id } = row
    const { brandCode } = this.queryParams.conditions
    UdModal.open({
      title: '审批日志',
      content: <ReviewLogContent id={id} brandCode={brandCode} />,
      footer: null,
    })
  }

}

interface ISettledReviewListProps extends IBaseListPageProps {
  
}

interface ISettledReviewListState extends IBaseListPageState {
  
}
